import { defineStore } from "pinia";

interface CounterState {
  count: number;
  age: number;
  name: string;
  categoryList: { categoryId: number; categoryName: string }[];
}

// 定义pinia的模块
// defineStore(模块名称, 模块具体内容) ，模块名称在开发者调试工具能显示这个名称
// 返回值是一个函数，调用函数就能得到一个对象，对象包含当前模块所有数据（所有数据都进行了数据代理）
export const useCounterStore = defineStore("counter", {
  // 当前模块管理的数据
  state: (): CounterState => {
    // 函数必须返回一个对象
    // 返回的对象就是当前模块管理的所有数据
    return {
      count: 0,
      age: 18,
      name: "jack",
      categoryList: [],
    };
  },
  // 包含n个只读的计算属性数据
  getters: {
    oddOrEven(state) {
      return state.count % 2 === 0 ? "偶数" : "奇数";
    },
  },
  // action函数，相当于vuex的action+mutation的集合体
  // action函数需要发送请求，也需要直接更新数据
  actions: {
    // action函数能接受n个参数，n个参数都是组件触发action函数传入的参数
    increment(num: number) {
      // this指向当前pinia模块，可以访问到state、getters等数据
      this.count += num;
    },
  },
});
